<template>
	<view class="uni-padding-wrap">
		<view class="headerTitle">
			员工健康打卡表
			<view>{{today}}</view>
		</view>
		
		<view class="headerDesc">全体员工：为有效防控新型冠状病毒疫情，根据上级有关部门要求，请真实填写员工信息及<view class="headerRedDesc">在过去14天内的情况</view>，配合做好疫情防控工作。若无企业号, 请企业管理人员(如HR等) 点击"管理入口"申请。</view>
		<view class="headerDesc">疫情高发区包括(湖北, 浙江, 广东, 河南, 湖南, 安徽, 江西, 重庆, 山东, 四川, 北京, 上海, 黑龙江, 福建等)。</view>

		<view class="manageIn" @click="goManage">
			管理入口
		</view>
		<form @submit="formSubmit" @reset="formReset">
			<view class="uni-form-item uni-column">
				<view class="title">企业号</view>
				<input class="uni-input" name="company" :disabled="companyDisabled" v-model="company" placeholder="请输入企业号" ></input>
			</view>
			<view class="uni-form-item uni-column">
				<view class="title">部门编号</view>
				<input class="uni-input" name="department" placeholder="请输入部门编号" />
			</view>
			<view class="uni-form-item uni-column">
				<view class="title">工号</view>
				<input class="uni-input" name="jobnumber" placeholder="请输入工号" />
			</view>
			<view class="uni-form-item uni-column">
				<view class="title">姓名</view>
				<input class="uni-input" name="name" placeholder="请输入姓名" />
			</view>
			<view class="uni-form-item uni-column">
				<view class="title">是否出过本地区</view>
				<radio-group name="questionA">
					<label>
						<radio value="1" /><text>是</text>
					</label>
					<label>
						<radio value="0" /><text>否</text>
					</label>
				</radio-group>
			</view>
			<view class="uni-form-item uni-column">
				<view class="title">是否到过疫情高发区</view>
				<radio-group name="questionB">
					<label>
						<radio value="1" /><text>是</text>
					</label>
					<label>
						<radio value="0" /><text>否</text>
					</label>
				</radio-group>
			</view>
			<view class="uni-form-item uni-column">
				<view class="title">是否与疫情高发区旅居人员接触</view>
				<radio-group name="questionC">
					<label>
						<radio value="1" /><text>是</text>
					</label>
					<label>
						<radio value="0" /><text>否</text>
					</label>
				</radio-group>
			</view>
			<view class="uni-form-item uni-column">
				<view class="title">是否与疑似病例接触</view>
				<radio-group name="questionD">
					<label>
						<radio value="1" /><text>是</text>
					</label>
					<label>
						<radio value="0" /><text>否</text>
					</label>
				</radio-group>
			</view>
			<view class="uni-form-item uni-column">
				<view class="title">是否经停疫情高发区</view>
				<radio-group name="questionE">
					<label>
						<radio value="1" /><text>是</text>
					</label>
					<label>
						<radio value="0" /><text>否</text>
					</label>
				</radio-group>
			</view>
			<view class="uni-form-item uni-column">
				<view class="title">是否在外地乘坐公共交通工具（包括：火车，飞机，汽车等）</view>
				<radio-group name="questionF">
					<label>
						<radio value="1" /><text>是</text>
					</label>
					<label>
						<radio value="0" /><text>否</text>
					</label>
				</radio-group>
			</view>
			
			<view class="uni-form-item uni-column">
				<view class="title">是否有发热，呼吸道症状等</view>
				<radio-group name="questionG">
					<label>
						<radio value="1" /><text>是</text>
					</label>
					<label>
						<radio value="0" /><text>否</text>
					</label>
				</radio-group>
			</view>
			<view class="uni-form-item uni-column">
				<view class="title">其他情况说明</view>
				<view class="uni-textarea">
				     <textarea placeholder="如存在其它任何可能的疫情接触和身体不适请在此说明" name="extraInfo"/>
				</view>
				
			</view>

			<view class="uni-btn-v">
				<button form-type="submit" type='primary'>提交</button>
				<button type="default" form-type="reset">重置</button>
			</view>
		</form>
	</view>
</template>

<style>
	.uni-form-item .title {
		padding: 20rpx 0;
	}
	.headerTitle{
		font-size: 18px;
		text-align: center;
	}
	.extraInfo {
		font-size: 24rpx;
		color:#666666;
		margin-top: 0px;
	}
	.headerQuestion{
		font-size: 18px;
	}
	.headerDesc{
		color:#7A7E83;
		font-size: 16px;
	}
	.headerRedDesc{
		color:red;
		font-size: 16px;
		display: inline;
	}

	.manageIn {
		position: absolute;
		top: 10rpx;
		right: 30rpx;
		color: #007aff;
	}
</style>
<script>
	var graceChecker = require('common/graceChecker.js');
	import moment from 'moment';
	import {
		mapState
	} from 'vuex';
	export default {
		computed: mapState(['hasLogin']),
		data() {
			return {
				'today':moment().format('YYYY/MM/DD'),
				company:'',
				companyDisabled: false
			}
		},
		onLoad: function(option) {
			if(option.id) {
				this.company = option.id;
				this.companyDisabled = 1;
			}
			
			
		},
		methods: {
			goManage: function() {
				if (!this.hasLogin) {
					uni.navigateTo({
						url: '../user/login'
					});
				} else {
					uni.navigateTo({
						url: '../manager/index'
					});
				}
				
				
				
			},
			formSubmit: function(e) {
				console.log('form发生了submit事件，携带数据为：' + JSON.stringify(e.detail.value))
				//定义表单规则
				var rule = [{
						name: "company",
						checkType: "notnull",
						checkRule: "",
						errorMsg: "请填写企业号"
					},
					{
						name: "jobnumber",
						checkType: "notnull",
						checkRule: "",
						errorMsg: "请填写工号"
					},
					{
						name: "name",
						checkType: "string",
						checkRule: "1,4",
						errorMsg: "姓名应为1-4个字符"
					},
					{
						name: "questionA",
						checkType: "in",
						checkRule: "0,1",
						errorMsg: "请选择在过去的14天内，是否出过本地区"
					},
					{
						name: "questionB",
						checkType: "in",
						checkRule: "0,1",
						errorMsg: "请选择在过去的14天内，是否到过疫情高发区"
					},
					{
						name: "questionC",
						checkType: "in",
						checkRule: "0,1",
						errorMsg: "请选择在过去的14天内，是否与疫情高发区旅居人员接触"
					},
					{
						name: "questionD",
						checkType: "in",
						checkRule: "0,1",
						errorMsg: "请选择是否与疑似病例接触"
					},
					{
						name: "questionE",
						checkType: "in",
						checkRule: "0,1",
						errorMsg: "请选择在过去的14天内，是否经停疫情高发区"
					},
					{
						name: "questionF",
						checkType: "in",
						checkRule: "0,1",
						errorMsg: "请选择在过去的14天内，是否在外地乘坐公共交通工具（包括：火车，飞机，汽车等）"
					},
					{
						name: "questionG",
						checkType: "in",
						checkRule: "0,1",
						errorMsg: "请选择在过去的14天内，是否有发热，呼吸道症状等"
					}
				];
				//进行表单检查
				var formData = e.detail.value;

				var checkRes = graceChecker.check(formData, rule);
				if (!checkRes) {
					uni.showToast({
						title: graceChecker.error,
						icon: "none"
					});
				} else {
					uniCloud.callFunction({
						name: 'company_collect_submit',
						data: formData
					}).then((res) => {
						uni.hideLoading()
						uni.reLaunch({
							url: 'result/result?advice='+res.result
						});
						
						// uni.showModal({
						// 	content: `提交成功，建议:${res.result}`,
						// 	showCancel: false
						// })
					}).catch((err) => {
						uni.hideLoading()
						uni.showModal({
							content: `添加数据失败，错误信息为：${err.message}`,
							showCancel: false
						})
						console.error(err)
					})
				}
			},
			formReset: function(e) {
				console.log('清空数据')
			}

		}
	}
</script>
